<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>ExtractText</title>
    {% include 'General/Packages.html' %}
    {% load static %}
    <link rel="stylesheet" type="text/css" href="{% static 'css/extract.css' %}">
</head>

<body>
<div class="container-fluent">
    <div class="row">{% include 'General/Navigator.html' %}</div>
    <div class="offset-md-2 col-md-8 mainContent">
        <form class="row g-3 formBox" method="post">
            {% csrf_token %}
            <div class="col-auto">
                <button type="submit" class="btn btn-primary">Extract</button>
            </div>
            <div class="col-auto">
                {#                <button type="button" class="btn btn-danger" >Clear</button>#}
                <a class="btn btn-danger text-nowrap" id="clear" href="/extract">Clear</a>
            </div>
            <div class="col-auto">
                <input type="text" class="form-control" style="width: 100%;" id="keywords" name="keywords"
                       placeholder={{ keyWords }}>
            </div>
            <div class="shadow p-3 mb-10 bg-white rounded">
                <div class="row">
                    <div class="col">
                        {% if inputText %}
                            <textarea class="form-control" rows="15" id="inputBox">{{ inputText }}</textarea>
                        {% else %}
                            <textarea class="form-control" rows="15"
                                      name="inputBox" id="inputBox">Input your original text here.</textarea>
                        {% endif %}
                    </div>
                    <div class="col">
                        {% if finalSentence %}
                            <textarea class="form-control" rows="15" id="outputBox">{{ finalSentence }}</textarea>
                        {% else %}
                            <textarea class="form-control" rows="15"
                                      id="outputBox">Your result will show up here.</textarea>
                        {% endif %}
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="row">{% include 'General/Copyright.html' %}</div>
</div>
</body>

</html>